<!--
 * @Description: 维修历史
 * @Autor: 何兴家
 * @Date: 2020-12-17 17:31:14
 * @LastEditors: 马毅
 * @LastEditTime: 2021-09-01 13:58:46
-->
<template>
  <div>
    <BreakSpace label="车主车辆信息" :containerStyle="{ marginBottom: '10px' }"></BreakSpace>
    <FormPanel ref="carDetailInfo" :list="formList" :cols="4" :isSubmitBtn="false" formType="show"></FormPanel>
    <el-tabs v-model="activePanel">
      <el-tab-pane label="本地维修历史" name="本地维修历史">
        <TopFilter ref="localOrderFilter" :list="localOrderFilterList" @filterChange="handleLocalOrderSearch"></TopFilter>
        <FilterTable
          ref="localOrderHistoryTable"
          columnsRef="repair_repairReception_customer_repairHistory_orderHistory"
          height="auto"
          :columns="localOrderHistoryColumns"
          :fetchapi="localOrderHistoryFetchapi"
          :isSelectColumn="false"
          :params="localOrderHistoryFetchParams"
          :datakey="'rows'"
          :onColumnsChange="columns => (this.localOrderHistoryColumns = columns)"
        >
        </FilterTable>
      </el-tab-pane>
      <el-tab-pane label="本地维修项目" name="本地维修项目">
        <TopFilter ref="repairLabourFilter" :list="localRepairLabourFilterList" @filterChange="handleLocalRepairLabourSearch"></TopFilter>
        <FilterTable
          ref="localLabourHistoryTable"
          columnsRef="repair_repairReception_customer_repairHistory_labourHistory"
          height="auto"
          :columns="localRepairLabourHistoryColumns"
          :fetchapi="localRepairLabourHistoryFetchapi"
          :isSelectColumn="false"
          :params="localRepairLabourHistoryFetchParams"
          :datakey="'rows'"
          :onColumnsChange="columns => (this.localRepairLabourHistoryColumns = columns)"
        >
        </FilterTable>
      </el-tab-pane>
      <el-tab-pane label="本地维修材料" name="本地维修材料">
        <TopFilter ref="repairPartFilter" :list="localRepairPartFilterList" @filterChange="handleLocalRepairPartSearch"></TopFilter>
        <FilterTable
          ref="localPartHistoryTable"
          columnsRef="repair_repairReception_customer_repairHistory_partHistory"
          height="auto"
          :columns="localRepairPartHistoryColumns"
          :fetchapi="localRepairPartHistoryFetchapi"
          :isSelectColumn="false"
          :params="localRepairPartHistoryFetchParams"
          :datakey="'rows'"
          :onColumnsChange="columns => (this.localRepairPartHistoryColumns = columns)"
        >
        </FilterTable>
      </el-tab-pane>
      <el-tab-pane label="全国维修历史" name="全国维修历史">
        <TopFilter ref="repairPartFilter" :list="oemOrderFilterList" @filterChange="handleOemOrderHistorySearch"></TopFilter>
        <FilterTable
          ref="oemOrderTable"
          columnsRef="repair_repairReception_customer_repairHistory_oemOrder"
          height="auto"
          :columns="oemOrderHistoryColumns"
          :fetchapi="oemOrderHistoryFetchapi"
          :isSelectColumn="false"
          :params="oemOrderHistoryFetchParams"
          :datakey="'rows'"
          :onColumnsChange="columns => (this.oemOrderHistoryColumns = columns)"
        >
        </FilterTable>
      </el-tab-pane>
    </el-tabs>

    <!-- 本地维修历史详情 -->
    <BaseDialog :visible.sync="showLocalOrderHistoryDetailPanel" title="工单详情" destroyOnClose :containerStyle="{ height: 'calc(100% - 60px)', overflow: 'auto', paddingBottom: '60px' }">
      <orderDetail :repairTypeDict="repairTypeDict" :sfqfDict="sfqfDict" :orderInfo="selectedLocalHistoryOrder" @close="showLocalOrderHistoryDetailPanel = false" />
    </BaseDialog>

    <!-- 全国维修历史详情 -->
    <BaseDialog :visible.sync="showOemOrderHistoryDetailPanel" title="工单详情" destroyOnClose :containerStyle="{ height: 'calc(100% - 60px)', overflow: 'auto', paddingBottom: '60px' }">
      <oemOrderDetail :repairTypeDict="repairTypeDict" :sfqfDict="sfqfDict" :orderInfo="selectedOEMHistoryOrder" @close="showOemOrderHistoryDetailPanel = false" />
    </BaseDialog>

    <div class="dialogBottmView">
      <el-button @click="handleCancel">取消</el-button>
      <!-- <el-button type="primary">确定</el-button> -->
    </div>
  </div>
</template>

<script>
import _ from 'lodash';
import { dictionary } from '@/utils/dictMixin';
import { confirmAction, notifyAction, findFormItem, findTableItem } from '@/utils';
import dictCode from '@/utils/dictCode';
import { getDealerUser } from '@/api/repair/common';

import orderDetail from './orderDetail';
import oemOrderDetail from './oemOrderDetail';

import {
  getWxlxSelect,
  getSfqfSelect,
  queryLocalRepairHistory,
  queryLocalRepairHistoryDetail,
  queryLocalRepairLabour,
  queryLocalRepairPart,
  queryOEMRepairHistory,
  queryOEMRepairHistoryDetail,
  byAllTranslate
} from '@/api/repair/repairReception/customer';
import { searchRoleByCode } from '@/api/common/empSelect/index';

export default {
  props: ['vin', 'carInfo'],
  components: {
    orderDetail,
    oemOrderDetail
  },
  mixins: [dictionary],
  data() {
    this.repairTypeDict = []; // 维修类型字典
    this.sfqfDict = []; // 收费区分字典
    this.selectedLocalHistoryOrder = {}; // 选中查看的本地工单
    this.selectedOEMHistoryOrder = {}; // 选中查看的OEM工单
    return {
      localOrderFilterList: this.createLocalOrderFIlterList(),
      localRepairLabourFilterList: this.createLocalRepairLabourFIlterList(),
      localRepairPartFilterList: this.createLocalRepairPartFIlterList(),
      oemOrderFilterList: this.createOemOrderFIlterList(),
      formList: this.createFormList(),

      localOrderHistoryColumns: this.createLocalOrderHistoryColumns(),
      localRepairLabourHistoryColumns: this.createLocalRepairLabourHistoryColumns(),
      localRepairPartHistoryColumns: this.createLocalRepairPartHistoryColumns(),
      oemOrderHistoryColumns: this.createOemOrderHistoryColumns(),

      localOrderHistoryFetchapi: queryLocalRepairHistory,
      localRepairLabourHistoryFetchapi: queryLocalRepairLabour,
      localRepairPartHistoryFetchapi: queryLocalRepairPart,
      oemOrderHistoryFetchapi: queryOEMRepairHistory,

      localOrderHistoryFetchParams: { xhrAbort: true, vin: '', isRoCreate: 1 },
      localRepairLabourHistoryFetchParams: { xhrAbort: true, vin: '', isRoCreate: 1 },
      localRepairPartHistoryFetchParams: { xhrAbort: true, vin: '', isRoCreate: 1 },
      oemOrderHistoryFetchParams: { xhrAbort: true, vin: '', isRoCreate: 1 },

      showLocalOrderHistoryDetailPanel: false, // 是否显示本地维修历史详情弹窗
      showOemOrderHistoryDetailPanel: false, // 是否显示OEM工单维修历史详情

      SyncTableData: [], // 同步的本地维修历史table数据
      SyncTableData: [], // 同步的本地维修项目table数据
      SyncTableData: [], // 同步的本地维修材料table数据
      SyncTableData: [], // 同步的全国维修历史table数据

      activePanel: '本地维修历史',
      showPanel: false
    };
  },
  mounted() {
    if (this.vin) {
      this.localOrderHistoryFetchParams.vin = this.vin;
      this.localRepairLabourHistoryFetchParams.vin = this.vin;
      this.localRepairPartHistoryFetchParams.vin = this.vin;
      this.oemOrderHistoryFetchParams.vin = this.vin;
    }
    this.initDictCode();
    this.initCarInfoData();
  },
  methods: {
    createLocalOrderFIlterList() {
      return [
        {
          type: 'SELECT',
          label: '维修类型',
          fieldName: 'reapirTypeCode',
          itemList: []
        },
        {
          type: 'RANGE_INPUT_NUMBER',
          label: '进厂里程',
          fieldName: 'mileageBegin|mileageEnd'
        }
      ];
    },
    createLocalRepairLabourFIlterList() {
      return [
        {
          type: 'INPUT',
          label: '项目代码',
          fieldName: 'labourCode'
        },
        {
          type: 'INPUT',
          label: '项目名称',
          fieldName: 'labourName'
        },
        {
          type: 'SELECT',
          label: '维修类型',
          fieldName: 'reapirTypeCode',
          itemList: []
        },
        {
          type: 'RANGE_INPUT_NUMBER',
          label: '进厂里程',
          fieldName: 'mileageBegin|mileageEnd'
        }
      ];
    },
    createLocalRepairPartFIlterList() {
      return [
        {
          type: 'INPUT',
          label: '配件代码',
          fieldName: 'partNo'
        },
        {
          type: 'INPUT',
          label: '配件名称',
          fieldName: 'partName'
        }
      ];
    },
    createOemOrderFIlterList() {
      return [
        {
          type: 'RANGE_DATE',
          label: '开单日期',
          fieldName: 'beginDate|endDate'
        }
      ];
    },
    createFormList() {
      return [
        {
          type: 'INPUT',
          label: '车牌号',
          fieldName: 'license'
        },
        {
          type: 'INPUT',
          label: 'vin',
          fieldName: 'vin'
        },
        {
          type: 'INPUT',
          label: '发动机号',
          fieldName: 'engineNo'
        },
        {
          type: 'INPUT',
          label: '车主',
          fieldName: 'ownerName'
        }
      ];
    },
    createLocalOrderHistoryColumns() {
      return [
        {
          title: '序号',
          dataIndex: 'index',
          width: 80,
          sorter: true,
          render: props => {
            return <span>{props.row.index + 1}</span>;
          }
        },
        {
          title: '操作',
          dataIndex: 'operation',
          render: props => {
            return (
              <el-button
                type="text"
                onClick={() => {
                  this.handleViewLocalHistoryDetail(props.row);
                }}
              >
                明细
              </el-button>
            );
          }
        },
        {
          title: '工单号',
          dataIndex: 'RO_NO',
          sorter: true,
          filter: true,
          filterType: 'input'
        },
        {
          title: '车牌号',
          dataIndex: 'LICENSE',
          sorter: true,
          filter: true,
          filterType: 'input'
        },
        {
          title: '维修类型',
          dataIndex: 'REPAIR_TYPE_CODE',
          sorter: true,
          filter: true,
          filterType: 'checkbox',
          filterItems: [],
          dictItems: []
        },
        {
          title: '进厂里程',
          dataIndex: 'IN_MILEAGE',
          sorter: true,
          filter: true,
          filterType: 'input'
        },
        {
          title: '开单日期',
          dataIndex: 'RO_CREATE_DATE',
          sorter: true,
          filter: true,
          filterType: 'input'
        },
        {
          title: '服务顾问',
          dataIndex: 'SERVICE_ADVISOR',
          sorter: true,
          filter: true,
          filterType: 'checkbox',
          filterItems: [],
          dictItems: []
        },
        {
          title: '工单状态',
          dataIndex: 'RO_STATUS',
          sorter: true,
          filter: true,
          filterType: 'input',
          dictItems: this.createDictList(8049)
        }
      ];
    },
    createLocalRepairLabourHistoryColumns() {
      return [
        {
          title: '序号',
          dataIndex: 'index',
          width: 80,
          sorter: true,
          render: props => {
            return <span>{props.row.index + 1}</span>;
          }
        },
        {
          title: '工单号',
          dataIndex: 'RO_NO',
          sorter: true,
          filter: true,
          filterType: 'input'
        },
        {
          title: '项目代码',
          dataIndex: 'LABOUR_CODE',
          sorter: true,
          filter: true,
          filterType: 'input'
        },
        {
          title: '项目名称',
          dataIndex: 'LABOUR_NAME',
          sorter: true,
          filter: true,
          filterType: 'input'
        },
        {
          title: '维修项目类型',
          dataIndex: 'REPAIR_TYPE_CODE',
          sorter: true,
          filter: true,
          filterType: 'checkbox',
          filterItems: [],
          dictItems: []
        },
        {
          title: '进厂里程',
          dataIndex: 'IN_MILEAGE',
          sorter: true,
          filter: true,
          filterType: 'input'
        },
        {
          title: '收费区分',
          dataIndex: 'CHARGE_PARTITION_CODE',
          sorter: true,
          filter: true,
          filterType: 'checkbox',
          filterItems: [],
          dictItems: []
        },
        {
          title: '检查结果',
          dataIndex: 'CHECK_RESULT',
          sorter: true,
          filter: true,
          filterType: 'input'
        },
        {
          title: '标准工时',
          dataIndex: 'STD_LABOUR_HOUR',
          sorter: true,
          filter: true,
          filterType: 'input'
        },
        {
          title: '派工工时',
          dataIndex: 'ASSIGN_LABOUR_HOUR',
          sorter: true,
          filter: true,
          filterType: 'input'
        },
        {
          title: '工时单价',
          dataIndex: 'LABOUR_PRICE',
          sorter: true,
          filter: true,
          filterType: 'input'
        },
        {
          title: '折扣率',
          dataIndex: 'DISCOUNT',
          sorter: true,
          filter: true,
          filterType: 'input'
        },
        {
          title: '工时费',
          dataIndex: 'LABOUR_AMOUNT',
          sorter: true,
          filter: true,
          filterType: 'input'
        },
        {
          title: '派工标志',
          dataIndex: 'ASSIGN_TAG',
          sorter: true,
          filter: true,
          filterType: 'checkbox',
          filterItems: this.createDictList(1004),
          dictItems: this.createDictList(1004)
        },
        {
          title: '责任技师',
          dataIndex: 'TECHNICIAN',
          sorter: true,
          dictItems: []
        },
        {
          title: '是否不修',
          dataIndex: 'NEEDLESS_REPAIR',
          sorter: true,
          filter: true,
          filterType: 'checkbox',
          filterItems: this.createDictList(1004),
          dictItems: this.createDictList(1004)
        },
        {
          title: '是否委外',
          dataIndex: 'CONSIGN_EXTERIOR',
          sorter: true,
          filter: true,
          filterType: 'checkbox',
          filterItems: this.createDictList(1004),
          dictItems: this.createDictList(1004)
        },
        {
          title: '活动编号',
          dataIndex: 'ACTIVITY_CODE',
          sorter: true,
          filter: true,
          filterType: 'input'
        },
        {
          title: '备注',
          dataIndex: 'REMARK',
          sorter: true,
          filter: true,
          filterType: 'input'
        }
      ];
    },
    createLocalRepairPartHistoryColumns() {
      return [
        {
          title: '序号',
          dataIndex: 'index',
          width: 80,
          sorter: true,
          render: props => {
            return <span>{props.row.index + 1}</span>;
          }
        },
        {
          title: '工单号',
          dataIndex: 'RO_NO',
          sorter: true,
          filter: true,
          filterType: 'input'
        },
        {
          title: '仓库代码',
          dataIndex: 'STORAGE_CODE',
          sorter: true,
          filter: true,
          filterType: 'input'
        },
        {
          title: '配件代码',
          dataIndex: 'PART_NO',
          sorter: true,
          filter: true,
          filterType: 'input'
        },
        {
          title: '配件名称',
          dataIndex: 'PART_NAME',
          sorter: true,
          filter: true,
          filterType: 'input'
        },
        {
          title: '库位',
          dataIndex: 'STORAGE_POSITION_CODE',
          sorter: true,
          filter: true,
          filterType: 'input'
        },
        {
          title: '收费区分',
          dataIndex: 'CHARGE_PARTITION_CODE',
          sorter: true,
          filter: true,
          filterType: 'checkbox',
          filterItems: [],
          dictItems: []
        },
        {
          title: '计量单位',
          dataIndex: 'UNIT_CODE',
          sorter: true,
          filter: true,
          filterType: 'input'
        }
      ];
    },
    createOemOrderHistoryColumns() {
      return [
        {
          title: '序号',
          dataIndex: 'index',
          width: 80,
          sorter: true,
          render: props => {
            return <span>{props.row.index + 1}</span>;
          }
        },
        {
          title: '操作',
          dataIndex: 'operation',
          render: props => {
            return (
              <el-button
                type="text"
                onClick={() => {
                  this.handleViewOemHistoryDetail(props.row);
                }}
              >
                明细
              </el-button>
            );
          }
        },
        {
          title: '经销商简称',
          dataIndex: 'OWNER_CODE',
          sorter: true,
          filter: false,
          filterType: 'input',
          dictItems: []
        },
        {
          title: '工单号',
          dataIndex: 'RO_NO',
          sorter: true,
          filter: true,
          filterType: 'input',
          width: 180
        },
        {
          title: '车牌号',
          dataIndex: 'LICENSE',
          sorter: true,
          filter: true,
          filterType: 'input'
        },
        {
          title: '维修类型',
          dataIndex: 'REPAIR_TYPE_CODE',
          sorter: true,
          filter: true,
          filterType: 'checkbox',
          filterItems: [],
          dictItems: []
        },
        {
          title: '进厂里程',
          dataIndex: 'IN_MILEAGE',
          sorter: true,
          filter: true,
          filterType: 'input'
        },
        {
          title: '开单日期',
          dataIndex: 'RO_CREATE_DATE',
          sorter: true,
          filter: true,
          filterType: 'input'
        },
        {
          title: '服务工程师',
          dataIndex: 'SERVICE_ADVISOR',
          sorter: true,
          filter: true,
          filterType: 'checkbox',
          filterItems: [],
          dictItems: []
        },
        {
          title: '工单状态',
          dataIndex: 'RO_STATUS',
          sorter: true,
          filter: true,
          filterType: 'input',
          dictItems: this.createDictList(8049)
        }
      ];
    },

    // 本地维修历史点击搜索
    handleLocalOrderSearch(e) {
      let data = _.cloneDeep(e);
      this.localOrderHistoryFetchParams = Object.assign({}, this.localOrderHistoryFetchParams, data, { xhrAbort: false });
    },
    // 本地维修项目点击搜索
    handleLocalRepairLabourSearch(e) {
      let data = _.cloneDeep(e);
      this.localRepairLabourHistoryFetchParams = Object.assign({}, this.localRepairLabourHistoryFetchParams, data, { xhrAbort: false });
    },
    // 本地维修材料点击搜索
    handleLocalRepairPartSearch(e) {
      let data = _.cloneDeep(e);
      this.localRepairPartHistoryFetchParams = Object.assign({}, this.localRepairPartHistoryFetchParams, data, { xhrAbort: false });
    },
    // 全国维修历史点击搜索
    handleOemOrderHistorySearch(e) {
      e.endDate && (e.endDate = e.endDate.split(' ')[0] + ' 23:59:59');
      let data = _.cloneDeep(e);
      this.oemOrderHistoryFetchParams = Object.assign({}, this.oemOrderHistoryFetchParams, data, { xhrAbort: false });
    },

    // 初始化顶部车辆信息
    initCarInfoData() {
      this.formList.forEach(item => {
        item.initialValue = this.carInfo[item.fieldName];
      });
    },
    // 字典项查询
    initDictCode() {
      this.queryRepairTypeDict();
      this.querySfqfDict();
      this.queryServiceAdviserList();
      this.queryDealerUser();
      this.queryAllDealer();
    },
    //翻译经销商代码
    async queryAllDealer() {
      let res = await byAllTranslate();
      if (res.resultCode == 200) {
        let tempList = res.data.map(x => ({
          value: x.dealerCode,
          text: x.dealerName
        }));
        this.oemOrderHistoryColumns.find(x => x.dataIndex == 'OWNER_CODE').dictItems = tempList;
      }
    },
    // 获取维修类型
    async queryRepairTypeDict() {
      let res = await getWxlxSelect();
      if (res.resultCode == 200) {
        this.repairTypeList = res.data;
        let repairTypeDict = res.data.map(item => ({ text: item.REPAIR_TYPE_NAME, value: item.REPAIR_TYPE_CODE + '' }));
        this.repairTypeDict = repairTypeDict;
        let targetFormItems = [findFormItem(this.localOrderFilterList, 'reapirTypeCode'), findFormItem(this.localRepairLabourFilterList, 'reapirTypeCode')];
        let targetTableItems = [
          findTableItem(this.localOrderHistoryColumns, 'REPAIR_TYPE_CODE'),
          findTableItem(this.localRepairLabourHistoryColumns, 'REPAIR_TYPE_CODE'),
          findTableItem(this.oemOrderHistoryColumns, 'REPAIR_TYPE_CODE')
        ];

        targetFormItems.forEach(item => {
          item.itemList = repairTypeDict;
        });
        targetTableItems.forEach(item => {
          item.dictItems = item.filterItems = repairTypeDict;
        });
      }
    },
    // 获取收费区分
    async querySfqfDict() {
      let res = await getSfqfSelect();
      if (res.resultCode == 200) {
        let sfqfDict = res.data.map(item => ({ text: item.CHARGE_PARTITION_NAME, value: item.CHARGE_PARTITION_CODE }));
        this.sfqfDict = sfqfDict;
        let targetTableItems = [findTableItem(this.localRepairLabourHistoryColumns, 'CHARGE_PARTITION_CODE'), findTableItem(this.localRepairPartHistoryColumns, 'CHARGE_PARTITION_CODE')];
        targetTableItems.forEach(item => {
          item.dictItems = item.filterItems = sfqfDict;
        });
      }
    },
    // 获取服务顾问列表
    async queryServiceAdviserList() {
      let serviceConsultant = { role: dictCode.SERVICE_CONSULTANT };
      let res = await searchRoleByCode(serviceConsultant);
      if (res.resultCode == 200) {
        let serviceAdviserDict = res.data.map(item => ({ text: item.employeeName, value: item.userId + '' }));
        let targetTableItems = [findTableItem(this.localOrderHistoryColumns, 'SERVICE_ADVISOR'), findTableItem(this.oemOrderHistoryColumns, 'SERVICE_ADVISOR')];
        targetTableItems.forEach(item => {
          item.dictItems = item.filterItems = serviceAdviserDict;
        });
      }
    },
    // 查询所有人员(翻译用)
    async queryDealerUser() {
      let res = await getDealerUser();
      if (res.resultCode == 200) {
        let userDicts = res.data.map(item => ({ text: item.employeeName, value: item.userId + '' }));
        let tableTargets = [findTableItem(this.localRepairLabourHistoryColumns, 'TECHNICIAN')];
        tableTargets.forEach(item => {
          item.dictItems = item.filterItmes = userDicts;
        });
      }
    },
    // 查看本地历史详情
    handleViewLocalHistoryDetail(row) {
      this.selectedLocalHistoryOrder = row;
      this.showLocalOrderHistoryDetailPanel = true;
    },
    // 查看OEM工单历史详情
    handleViewOemHistoryDetail(row) {
      this.selectedOEMHistoryOrder = row;
      this.showOemOrderHistoryDetailPanel = true;
    },
    // 点击取消
    handleCancel() {
      this.$emit('close');
    }
  }
};
</script>

<style scoped></style>
